<template>
  <div :class="width">
    <el-select v-model="selectCompanyId" placeholder="请选择公司">
      <el-option v-for="company in companies"
                 :key="company.company_id"
                 :label="company.company_name"
                 :value="company.company_id"></el-option>
    </el-select>
  </div>
</template>

<script setup lang="ts">
import {useQuery} from "@pinia/colada";
import {getCompanies} from "../api/company.ts";

const selectCompanyId = defineModel<number>();

let {width = 'w-full'} = defineProps<{
  width?: string
}>()

let {data: companies} = useQuery({
  key: () => ["company"],
  query: async () => getCompanies,
});
</script>

<style scoped>

</style>